import React from 'react'
import SearchAreaDataBodySection from "./SearchAreaDataBodySection";

/**
 * 搜索数据
 *
 * @author leonzhangxf 20190117
 */
class SearchAreaData extends React.Component {
  constructor(props) {
    super(props);

    this.handleDataToStructured = this.handleDataToStructured.bind(this);
    this.getDataSection = this.getDataSection.bind(this);
  }

  handleDataToStructured() {
    let map = {}, result = [];
    for (let i = 0; i < this.props.data.length; i++) {
      let datum = this.props.data[i];
      if (!map[datum.category]) {
        result.push({
          category: datum.category,
          data: [datum]
        });
        map[datum.category] = datum;
      } else {
        for (let j = 0; j < result.length; j++) {
          let dj = result[j];
          if (dj.category === datum.category) {
            dj.data.push(datum);
            break;
          }
        }
      }
    }
    return result;
  }

  getDataSection() {
    return this.handleDataToStructured().map((datum) => {
      return (
        <SearchAreaDataBodySection key={datum.category} data={datum}>
        </SearchAreaDataBodySection>
      );
    });
  }

  render() {
    return (
      <div className="SearchArea-Data">
        <div className="SearchArea-Data-Header">
          <span className="SearchArea-Data-Header-Name">Name</span>
          <span className="SearchArea-Data-Header-Value">Price</span>
        </div>
        <div className="SearchArea-Data-Body">
          {this.getDataSection()}
        </div>
      </div>
    );
  }
}

export default SearchAreaData;